<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <table>
        <tr>
            <td><label for="">商品名称</label></td>
            <td><input type="text" placeholder="请输入商品名称" name="productName"></td>
        </tr>
        <tr>
            <td><label for="">售价：</label></td>
            <td><input type="text" placeholder="请输入商品价格" name="price"></td>
        </tr>
        <tr>
            <td><label for="">库存：</label></td>
            <td><input type="text" placeholder="请输入商品库存" name="stockNum"></td>
        </tr>
        <tr>
            <td><label for="">供应商：</label></td>
            <td><input type="text" placeholder="请输入商品供应商" name="supplier"></td>
        </tr>
        <tr>
            <td><input type="button" value="保存" onclick="save()"></td>
            <td><input type="button" value="取消并返回" onclick="cancel()"></td>
        </tr>
    </table>
    <script src="./js/jquery-3.6.0.min.js"></script>
    <script src="./js/api.js"></script>
    <!-- <script>
        $(function () {
            //当页面加载的时候，需要判断有没有id传入，如果有，则认为是编辑，需要（请求后台）加载数据；如果没有，则认为是新增
            let id = getUrlParam('id');
            console.log(id);
            getProductById(id).then(res => {
                console.log(res);
                let obj = res.data;
                $('[name=productName]').val(obj.productName);
                $('[name=price]').val(obj.price);
                $('[name=stock]').val(obj.stockNum);
                $('[name=supplier]').val(obj.supplier);
            })
        })
        //获取url中的参数
        function getUrlParam(name) {

            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象

            var r = window.location.search.substr(1).match(reg); //匹配目标参数

            if (r != null) return unescape(r[2]); return null; //返回参数值

        }
        function save() {
            let id = getUrlParam('id');
            console.log(id);
            let obj = {
                productName: $('[name=productName]').val(),
                price: $('[name=price]').val(),
                stock: $('[name=stock]').val(),
                supplier: $('[name=supplier]').val(),
            }
            // 如果id存在，则表示为编辑，否则为新增
            if (id) {
                updateProduct(id, obj).then(res => {
                    console.log(res);
                    location.href = './index.html';
                })
            } else {
                let params = {
                    productName: obj.productName,
                    price: obj.price,
                    stockNum: obj.stock,
                    supplier: obj.supplier
                }
                addProduct(params).then(res => {
                    location.href = './index.html';
                })
            }


        }
        function cancel() {
            location.href = './index.html';
        }
    </script> -->
</body>
</html>